/**
 * Text input class
 * @type {omplusClass}
 */
Omplus.views.Input = Omplus.base.extend(Omplus.views.Control, {
    /**
     * Creates <input/> and appends it to the content witch is just a <div> tag from Component
     */
    render:function () {
        var text = jQuery.extend(true, {}, $("<input/>"));
        var current = this;
        text.addClass("input").attr("type", this.type).attr("id", this.omplusName);
        this.getContent().append(text);
        if (this.readOnly) {
            text.attr("disabled", "disabled");
        }
    },

    omplusType:"Input",

    type:null,

    readOnly:false,

    getValue:function () {
        return this.getContent().find("input").val();
    },

    setValue:function (newValue) {
        this.getContent().find("input").val(newValue);
    }
});

Omplus.views.DataList = Omplus.base.extend(Omplus.views.Control, {
  
    render:function () {
        var list = jQuery.extend(true, {}, $("<datalist></datalist>"));
        list.attr("id", this.omplusName);
        this.getContent().append(list);
    },

    omplusType:"DataList",
    
    valueName:null,

    getValue:function () {},

    setValue:function (newValue) {
        this.getContent().html();
        for(var i in newValue){
        	var option = jQuery.extend(true, {}, $("<option>"));
        	option.attr("value", newValue[i][this.valueName]);
        	option.appendTo(this.getContent().find('datalist'));
        }
    }
});

Omplus.views.TextInput = Omplus.base.extend(Omplus.views.Input, {
    render:function () {
        var current = this;
        if (this.datalist != null) this.getContent().find("input").attr("list", this.datalist);
        $('body').on("keyup", "#" + this.omplusName, function () {
            Omplus.globals.getObject(current.omplusName + ".OnUpdateView").notify(current.controller);
        });
        $('body').on("input propertychange", "#" + this.omplusName, function(){
            Omplus.globals.getObject(current.omplusName + ".OnUpdateView").notify(current.controller);
        });
    },
    omplusType:"TextInput",
    type:"text",
    datalist: null
});

Omplus.views.PasswordInput = Omplus.base.extend(Omplus.views.Input, {
    render:function () {
        var current = this;
        $('body').on("keyup", "#" + this.omplusName, function () {
            Omplus.globals.getObject(current.omplusName + ".OnUpdateView").notify(current.controller);
        });
    },
    omplusType:"PasswordInput",
    type:"password"
});

Omplus.views.NewDateInput = Omplus.base.extend(Omplus.views.Input, {
    render:function () {
        var current = this;
        if (this.maxDate != null) {
        	if (this.maxDate == "today") {
        		var date = new Date();
        		var month = date.getMonth() + 1;
        		if (month < 10) month = "0" + month;
        		var day = date.getDate();
        		if (day < 10) day = "0" + day;
        		this.maxDate = date.getFullYear() + "-" + month + "-" + day;
        	}
        	this.getContent().find('input').attr('max', this.maxDate);
        }
        if (this.minDate != null) {
        	if (this.minDate == "today") {
        		var date = new Date();
        		var month = date.getMonth() + 1;
        		if (month < 10) month = "0" + month;
        		var day = date.getDate();
        		if (day < 10) day = "0" + day;
        		this.minDate = date.getFullYear() + "-" + day + "-" + month;
        	}
        	this.getContent().find('input').attr('min', this.minDate);
        }
        $('body').on("keyup", "#" + this.omplusName, function () {
            Omplus.globals.getObject(current.omplusName + ".OnUpdateView").notify(current.controller);
        });
        $('body').on("blur", "#" + this.omplusName, function () {
        	if (this.value != null){
        		if (current.maxDate != null && new Date(this.value) > new Date(this.max)){
        			this.value = current.maxDate;
        		}
        		if (current.minDate != null && new Date(this.value) < new Date(this.min)){
        			this.value = current.maxDate;
        		}
        		if (current.lt != null && new Date(this.value) < new Date($(current.lt).val())){
        			this.value = $(current.lt).val();
        		}
        		if (current.gt != null && new Date(this.value) > new Date($(current.gt).val())){
        			this.value = $(current.gt).val();
        		}
        	}
            Omplus.globals.getObject(current.omplusName + ".OnUpdateView").notify(current.controller);
        });
        $('body').on("change", "#" + this.omplusName, function () {
        	if (this.value != null){
        		if (current.maxDate != null && new Date(this.value) > new Date(this.max)){
        			this.value = current.maxDate;
        		}
        		if (current.minDate != null && new Date(this.value) < new Date(this.min)){
        			this.value = current.maxDate;
        		}
        		if (current.lt != null && new Date(this.value) < new Date($(current.lt).val())){
        			this.value = $(current.lt).val();
        		}
        		if (current.gt != null && new Date(this.value) > new Date($(current.gt).val())){
        			this.value = $(current.gt).val();
        		}
        	}
            Omplus.globals.getObject(current.omplusName + ".OnUpdateView").notify(current.controller);
        });
    },
    omplusType:"NewDateInput",
    type:"date",
    getValue:function () {
        return this.getContent().find("input").val() + " 00:00:00";
    },

    setValue:function (newValue) {
    	var helper = "";
    	if (newValue != null) helper = newValue.split(" ");
        this.getContent().find("input").val(helper[0]);
    },
    minDate:null,
    maxDate:null,
    isFrom:false,
    isTo:false,
    yearRange:"-100:+0",
    lt:null,
    gt:null
});

Omplus.views.HiddenInput = Omplus.base.extend(Omplus.views.Input, {
    omplusType:"HiddenInput",
    type:"hidden"
});

Omplus.views.CheckBox = Omplus.base.extend(Omplus.views.Input, {
    render:function () {
        var current = this;
        $('body').on("click", "#" + this.omplusName, function () {
            Omplus.globals.getObject(current.omplusName + ".OnUpdateView").notify(current.controller);
        });
    },
    omplusType:"CheckBox",
    type:"checkbox",
    getValue:function () {
        return this.getContent().find("input").is(":checked");
    },
    setValue:function (newValue) {
        this.getContent().find("input").attr("checked", newValue);
    }
});

Omplus.views.RadioButton = Omplus.base.extend(Omplus.views.Input, {
    render:function () {
        var current = this;
        this.getContent().find("input").attr("name", this.name).attr("id", this.omplusName).val(this.value);
        $('body').on("click", "#" + this.omplusName, function () {
            if (current.getContent().find("input").is(":checked")) {
                Omplus.globals.getObject(current.omplusName + ".OnUpdateView").notify(current.controller);
            }
        });
    },
    omplusType:"RadioButton",
    type:"radio",
    name:null,
    getValue:function () {
        return this.getContent().find("input").val();
    },
    setValue:function (newValue) {
        if (newValue == this.value) {
            this.getContent().find("input").attr("checked", true);
        }
    }
});

/**
 * Text area class
 * @type {omplusClass}
 */
Omplus.views.TextArea = Omplus.base.extend(Omplus.views.Control, {
    /**
     * Creates <textarea> and appends it to the content witch is just a <div> tag from Component
     */
    render:function () {
        var text = jQuery.extend(true, {}, $("<textarea></textarea>"));
        var current = this;
        text.addClass("textarea").attr("id", this.omplusName);
        if (this.readOnly) {
            text.attr("disabled", "disabled");
        }
        if (this.rows) {
            text.attr("rows", this.rows);
        }
        if (this.cols) {
            text.attr("cols", this.cols);
        }
        if (this.fixedSize) {
            text.css({
                resize:"none"
            });
        }
        this.getContent().append(text);
        $('body').on("keyup", "#" + this.omplusName, function () {
            Omplus.globals.getObject(current.omplusName + ".OnUpdateView").notify(current.controller);
        });
    },

    omplusType:"TextArea",

    readOnly:false,

    rows:null,

    cols:null,

    fixedSize:false,

    getValue:function () {
        return this.getContent().find("textarea").val();
    },

    setValue:function (newValue) {
        this.getContent().find("textarea").val(newValue);
    }
});

Omplus.views.SelectResult = Omplus.base.extend(Omplus.views.Control, {
    render:function () {
        var result = jQuery.extend(true, {}, $("<div></div>"));
        result.addClass("selectResult").attr("id", this.omplusName).appendTo(this.content);
        $("body").on("click", "#" + this.omplusName, function () {
            $(this).parent().parent().find(".selectList").fadeToggle(100);
        });
    },
    omplusType:"SelectResult",
    setValue:function (newValue) {
        this.getContent().find(".selectResult").html(newValue);
    }
});

Omplus.views.SelectList = Omplus.base.extend(Omplus.views.Control, {
    render:function () {
        var list = jQuery.extend(true, {}, $("<div></div>"));
        list.addClass("selectListContainer").attr("id", this.omplusName).appendTo(this.content);
        this.content.addClass("selectList");
        var helper = this;
        $("body").on("click", "#" + this.omplusName + " .selectOption", function () {
            Omplus.globals.getObject(helper.model).chooseByIndex($(this).attr("data-index"), helper.current);
            $(this).parent().parent().parent().find(".selectList").fadeToggle(100);
        });
    },
    omplusType:"SelectList",
    showModel:null,
    setValue:function (newValue) {
        var container = this.content.find(".selectListContainer");
        container.html("");
        if (newValue["list"]) {
            for (var i in newValue.list) {
                var list = jQuery.extend(true, {}, $("<div></div>"));
                list.attr("data-index", i).addClass("selectOption").appendTo(container);
                list.html(newValue.list[i][this.showModel]);
            }
        }
    }
});

Omplus.views.Select = Omplus.base.extend(Omplus.views.Container, {
    init:function () {
        this.result = Omplus.base.create(Omplus.views.SelectResult, {
            omplusName:this.omplusName + "Result",
            model:this.model + "." + this.current + "." + this.showModel,
            controller:this.controller,
            current:this.current
        });
        this.list = Omplus.base.create(Omplus.views.SelectList, {
            omplusName:this.omplusName + "List",
            model:this.model,
            showModel:this.showModel,
            controller:this.controller,
            current:this.current
        });
        $("body").on("click", "#" + this.omplusName + "List .selectOption", this.select);
        this.components = [this.result.omplusName, this.list.omplusName];
    },
    result:null,
    list:null,
    omplusType:"Select",
    showModel:null,
    current:"current",
    select:function () {
    }
});

Omplus.views.Datepicker = Omplus.base.extend(Omplus.views.TextInput, {
    render:function () {
        var current = this;
        $('body').on("change", "#" + this.omplusName, function () {
            var input = current.getContent().find("input");
            if (input.val() != "") {
                input.val(input.val() + (current.isFrom ? " 00:00:00" :
                    (current.isTo ? " 23:59:59" : "")));
            }
            Omplus.globals.getObject(current.omplusName + ".OnUpdateView").notify(current.controller);
        });
        current.getContent().find("input").addClass("datepicker")
            .attr("readonly", "readonly")
            .attr("id", current.omplusName).datepicker({
                minDate:this.minDate,
                maxDate:this.maxDate,
                dateFormat:"yy-mm-dd",
                showButtonPanel:true,
                changeYear: true,
                changeMonth: true,
                yearRange: this.yearRange,
                beforeShow:function (input) {
                    setTimeout(function () {
                        var buttonPane = $(input)
                            .datepicker("widget")
                            .find(".ui-datepicker-buttonpane");

                        $("<button>", {
                            text:"Clear",
                            click:function () {
                                $.datepicker._clearDate(input);
                            }
                        }).appendTo(buttonPane);
                    }, 1);
                }
            });
    },
    appendComponents:function () {
        // used to refresh the datepicker
        // because the click listener is lost when you change tabs
        this.getContent().find("input").removeClass("hasDatepicker").datepicker({
            minDate:this.minDate,
            maxDate:this.maxDate,
            dateFormat:"yy-mm-dd",
            showButtonPanel:true,
            changeYear: true,
            changeMonth: true,
            yearRange: this.yearRange,
            beforeShow:function (input) {
                setTimeout(function () {
                    var buttonPane = $(input)
                        .datepicker("widget")
                        .find(".ui-datepicker-buttonpane");

                    $("<button>", {
                        text:"Clear",
                        click:function () {
                            $.datepicker._clearDate(input);
                        }
                    }).appendTo(buttonPane);
                }, 1);
            }
        });
    },
    omplusType:"Datepicker",
    minDate:null,
    maxDate:null,
    isFrom:false,
    isTo:false,
    yearRange:"-100:+0"
});

Omplus.views.TempUploader = Omplus.base.extend(Omplus.views.Control, {
    render:function () {
        var form = jQuery.extend(true, {}, $("<form></form>"));
        var text = jQuery.extend(true, {}, $("<input/>"));
        var current = this;
        form.attr("id", this.omplusName)
            .attr("action", "/action?function=TempUpload")
            .attr("method", "post");
        text.addClass("input").attr("type", "file").attr("name", "file").attr("id", this.omplusName + "_Input");
        form.append(text);
        this.getContent().append(form);
        if (this.readOnly) {
            text.attr("disabled", "disabled");
        }
        $('body').on("change", "#" + this.omplusName, function () {
            $(this).ajaxForm(function (data) {
                switch (data[Omplus.constants.status]) {
                    case Omplus.constants.status_ok :
                        Omplus.globals.getObject(current.model).setValue(data[Omplus.constants.response_parameters], null);
                        if (current.callback) {
                            var func = current.callback;
                            func();
                        }
                        break;
                    case Omplus.constants.status_error :
                        if (data[Omplus.constants.response_parameters])
                            if (data[Omplus.constants.response_parameters][Omplus.constants.response_errors])
                                Omplus.globals.getObject(current.model).setErrors(currentProxy.convertErrors(data[Omplus.constants.response_parameters][Omplus.constants.response_errors]));
                        if (data[Omplus.constants.response_errors]) {
                            Omplus.globals.getObject(current.model).setErrors(currentProxy.convertErrors(data[Omplus.constants.response_errors]));
                        }
                        break;
                    default:
                        Omplus.globals.getObject(current.model).setStatus(Omplus.constants.status_bad_request);
                        break;
                }
            }).submit();
        });
    },

    omplusType:"TempUploader",

    callback:function () {
    },

    getValue:function () {
        return this.getContent().find("input").val();
    },

    setValue:function (newValue) {
        this.getContent().find("input").val(newValue);
    }
});

Omplus.views.List = Omplus.base.extend(Omplus.views.Control, {
    render:function () {
        var list = jQuery.extend(true, {}, $("<div></div>"));
        list.addClass("listContainer").attr("id", this.omplusName).appendTo(this.content);
        this.content.addClass("list");
        var helper = this;
        $("body").on("click", "#" + this.omplusName + " .listOption", function () {
            var clicked = $(this);
            if (helper.click) {
                helper.click(clicked);
            }
        });
    },
    setValue:function (newValue) {
        var container = this.content.find(".listContainer");
        container.html("");
        if (!this.listModel)
            this.listModel = "list";
        for (var i in newValue[this.listModel]) {
            var list = jQuery.extend(true, {}, $("<div></div>"));
            list.attr("data-index", i).addClass("listOption").appendTo(container);
            list.html(newValue[this.listModel][i][this.showModel]);
        }
    },
    click:function (clicked) {
    },
    omplusType:"List",
    showModel:null,
    listModel:null,
    clicked:null
});